<template>
  <div class="agri-page-container">
    <!-- 页面标题与操作按钮 -->
    <div class="agri-page-header">
      <div class="agri-page-title">
        <el-icon v-if="icon"><component :is="icon" /></el-icon>
        <span>{{ title }}</span>
      </div>
      <div class="agri-page-actions">
        <slot name="actions"></slot>
      </div>
    </div>
    
    <!-- 页面内容 -->
    <el-card class="agri-card" :body-style="{ padding: '0' }" v-loading="loading">
      <slot></slot>
    </el-card>
  </div>
</template>

<script setup>
defineProps({
  title: {
    type: String,
    required: true
  },
  icon: {
    type: String,
    default: null
  },
  loading: {
    type: Boolean,
    default: false
  }
});
</script>

<style scoped>
/* 样式已在全局样式文件中定义 */
</style> 